<template>
  <div>
     <flexbox v-for="group in groups">
      <flexbox-item>
          <div class="flex-demo">
              <img :src="group.url"/>
          </div>
      </flexbox-item>
      <flexbox-item>
          <div class="flex-demo">
              <span>{{group.title}}</span>
          </div>
      </flexbox-item>
    </flexbox>
  </div>
</template>

<script>
import { Blur, Cell, Group , Flexbox, FlexboxItem } from 'vux';

export default {
  name: '',
  components: {
    Flexbox,
    FlexboxItem
  },
  data() {
    return {
      groups:[
          {
              url: 'https://o3e85j0cv.qnssl.com/tulips-1083572__340.jpg',
              title: '想象力充值处'
          },
          {
              url: 'https://o3e85j0cv.qnssl.com/waterway-107810__340.jpg',
              title: '智慧想象博物馆1'
          },
          {
              url: 'https://o3e85j0cv.qnssl.com/hot-chocolate-1068703__340.jpg',
              title: '成长补给站'
          }
      ]

    };
  },
  mounted() {
    this.$nextTick(() => {
    });
  },
  methods: {
  },
};
</script>

<style lang="less">

</style>
